script setup lang="ts">
import {ref} from 'vue'
import {useRouter} from "vue-router";
const  router =useRouter();

const toDemo = () =>{
   router.push({path: "/demo"})}
const toHello = () =>{
   router.push({path: "/hello"})}

</script>

<template>
  <div id="d1">
    <div id="d2">
      <RouterLink to="/demo">去demo</RouterLink>
      <br>
      <RouterLink to="/hello">去hello</RouterLink>
      <br>
      <button @click="toDemo">去demo</button>
      <button @click="toHello">去hello</button>
    </div>
    <div id="d3">
      <RouterView/>
    </div>



  </div>
</template>

<style scoped>
#d1{
  display: flex;
}
#d2{
  width: 300px;
  height: 100%;
  background-color: cornflowerblue;
}

</style>